@use 'sass:map';

.login-form {
  // width: 358px;
  padding: 0 15px;
  margin: 0 auto;

  :global {
    .el-form-item {
      margin-bottom: 32px;

      &.hidden-form-item {
        display: none;
      }

      &.is-error {
        .el-input__inner,
        .el-input-group__append {
          box-shadow: none;
          border-bottom: 1px solid $color-danger;
        }
      }

      .el-input--large .el-input__wrapper {
        padding: 1px 8px 1px 0;
      }

      .el-input__inner {
        box-shadow: none;
        border-radius: 0;
        border-bottom: 1px solid map.get($border-color, '');
      }

      .el-input__prefix {
        color: map.get($text-color, 'regular');
        left: 10px;
      }

      .el-input__suffix {
        right: 0;
      }

      .el-input-group__append {
        padding: 0;
        box-shadow: none;
        border-bottom: 1px solid map.get($border-color, '');
      }
    }
  }

  .el-input-password-icon {
    border-color: transparent;
    background: transparent;
  }

  .login-verification-code {
    width: 100px;
    height: 38px;
    display: block;
  }

  .login-form-submit-btn {
    margin-top: 29px;
    width: 100%;
  }
}
